<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
response.setHeader("Pragma","No-cache"); 
response.setHeader("Cache-Control","no-cache"); 
response.setDateHeader("Expires", 0); 

response.flushBuffer();
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="../css/index.css">
<link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.5/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.5/themes/icon.css">
<link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.5/themes/color.css">
<script type="text/javascript" src="../jquery-easyui-1.4.5/jquery.min.js"></script>
<script type="text/javascript" src="../jquery-easyui-1.4.5/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../jquery-easyui-1.4.5/easyui.plugin.js"></script>
<script type="text/javascript" src="../jquery-easyui-1.4.5/datagrid-groupview.js"></script>
<script type="text/javascript" src="../js/echarts.js"></script>
<link rel="stylesheet" type="text/css" href="../css/index.css">
<title>库存趋势图</title>
<script type="text/javascript">
   var path="<%=basePath%>"; 
   		    
</script>
</head>
<body class="easyui-layout">
<div data-options="region:'north'" style="height:65px"   title="查询条件" >
<table style="width: 100%;line-height: 30px;" border=0>
   <tr>
      <td align="right">选择客户</td>
      <td><input id="clientname" class="easyui-combobox" name="clientname" data-options="required:true,valueField:'clientname',textField:'clientname',url:'<%=basePath%>clientinfo/getallclient1.html',onSelect:function(record){
                if(record.clientname.length>0){
                   $('#specifications').combobox('enable');	
                    $('#specifications').combobox('clear');	
                }
      }"  /></td>
      <td align="right">选择规格型号</td>
      <td><input id="specifications" class="easyui-combobox" name="specifications" data-options="required:true,valueField:'specifications',textField:'specifications',url:'<%=basePath%>report1/queryspecificationsbyclient.html',onShowPanel:function(){
           var   clientname= $('#clientname').combobox('getText');	
           if(clientname==''){
                   $('#specifications').combobox('hidePanel');	
                   alert('请先选择客户姓名！');
           }else{
                var rurl='<%=basePath%>report1/queryspecificationsbyclient.html?field=clientname&searchertext='+clientname;
                	rurl=encodeURI(rurl);
					rurl=encodeURI(rurl);
				$('#specifications').combobox('reload',rurl);  
           }
      },disabled:true"  /></td>
      <td align="right">选择年份</td>
      <td><input id="years" class="easyui-combobox" name="years" data-options="required:true,valueField:'years',textField:'years',url:'<%=basePath%>report1/queryyears.html'"  /></td>
      <td ><a class="easyui-linkbutton" onclick="query()" data-options="iconCls:'icon-search'">查询</a> </td>
   </tr>
</table>
</div>
<div region="center"   split="true"   title="图形统计" style="overflow: hidden;">
<div id="main"  style="height:450px"></div>
<script type="text/javascript">
function query(){
      var clientname=$("#clientname").combobox("getValue");
      var specifications=$("#specifications").combobox("getValue");
      var years=$("#years").combobox("getValue");
     //alert("clientname="+clientname+"  specifications="+specifications+"   years="+years);
      if(clientname==null||clientname==undefined||clientname==''){
           alert("请选择客户！");
           return false;
      }else if(specifications==null||specifications==undefined||specifications==''){
                 alert("请选择物品的规格型号！");
                return false;
      }else if(years==null||years==undefined||years==''){
                 alert("请选择所需查询的年份！");
                 return false;
      }
      var url=path+"report1/reporttubiaodate.html?specifications="+specifications+"&clientname="+clientname+"&year="+years;
      url = encodeURI(url);
	  url= encodeURI(url);
	$.ajax({  
	      type:'post',      
	      url:url,  
	      cache:false,  
	      dataType:'json',  
	      success:function(data){
		    var myChart = echarts.init(document.getElementById('main')); 
	        option = data;
		    myChart.setOption(option);
		    
	      },
		    error:function(){ 
		    	
		    }
	  });
}
$(function (){
   $('#main').append('<span style="color:red;float:left; padding:10px 10px;">请先选择查询条件后，再点击[查询]按钮；方可生成统计图表！</span>');
});
</script>
</div>
</body>
</html>